<template>
  {{ modelValue }} -- {{ count }} -- {{ double }} -- {{ info }} -- hooks{{ addNum }}
  <el-button @click="handleSendMsg" type="primary">按钮hooks</el-button>
</template>
<script setup>
import { computed, ref, watch, inject } from 'vue'
import {useAdd} from '@/utils/hooks'
const props = defineProps({
  modelValue: {
    type: String,
    default: ''
  }
})
const num1 = ref(120)
const num2 = ref(42)
const { addNum, addFn } = useAdd({ num1, num2 })
addFn(num1.value, num2.value)
const count = ref(0)
const emits = defineEmits()
const handleSendMsg = () => {
  emits('update:modelValue', 'handleSendMsg')
}
const addCount = () => {
  count.value ++
}
const double = computed(() => count.value * 2)
defineExpose({
  count,
  addCount
})
watch(count, (val) => {
  console.log(val)
})
const info = inject('info')
</script>